$activeColor: #2bdf9d;

%flexCenter {
	display: flex;
	justify-content: center;
	align-items: center;
}

#validateCode {
	position: absolute;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	padding: 80rpx $loginBoxPadding;
	box-sizing: border-box;
	@include blurBackground(rgba(0, 0, 0, 0.7), 100rpx);

	color: #fff;

	.code {
		display: flex;
		flex-direction: column;
		justify-content: center;
		width: 100%;
		height: auto;
		padding: 10rpx;
		margin: 40rpx 0;
		box-sizing: border-box;

		text {
			margin: 6rpx 0;
			font-weight: bold;
			&:nth-of-type(1) {
				font-size: 70rpx;
			}
			&:nth-of-type(2) {
				color: #fefefe;
				font-size: 28rpx;

				.phone {
					color: $activeColor;
					font-size: 30rpx;
				}
			}
		}

		.codeInput {
			margin-top: 20rpx;
		}
	}

	.hint {
		@extend %flexCenter;
		width: 100%;
		height: auto;
		color: #767474;

		button {
			background-color: transparent;
			border: none;
			outline: none;
			color: #5ce7b4;
			font-size: 32rpx;
			font-weight: bold;
		}
		.icon-shalou {
			font-size: 48rpx !important;
			vertical-align: middle;
		}
	}
}

.u-page {
	padding: 0;
}

.u-cell-icon {
	width: 36rpx;
	height: 36rpx;
	margin-right: 8rpx;
}

.u-cell-group__title__text {
	font-weight: bold;
}